import React, { memo } from 'react'
import type { FC, ReactNode } from 'react'
import { NewAlbumItemWrapper } from './style'

interface IProps {
  children?: ReactNode
  item: any
}

const NewAlbumItem: FC<IProps> = (props) => {
  const { item } = props
  return (
    <NewAlbumItemWrapper>
      <li className="item" key={item.id}>
        <div className="image_wrapper">
          <img src={item.blurPicUrl} className="image" />
          <a className="cover sprite_cover">{item.name}</a>
        </div>
        <a className="username nowrap">{item.name}</a>
        <a className="artname nowrap">{item.artist.name}</a>
      </li>
    </NewAlbumItemWrapper>
  )
}

export default memo(NewAlbumItem)
